<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>OpenLayers 3.x Cookbook - Peter J Langley</title>
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/index.css">
</head>
<body>

<div class="container">
    <div class="jumbotron">
        <h1>OpenLayers 3.x Cookbook</h1>
        <p>Peter J Langley</p>
    </div>

    <div class="row">
        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 1</h2>

                    <ol>
                        <li><a href="/ch01/ch01-full-screen-map">Creating a simple fullscreen map</a></li>
                        <li><a href="/ch01/ch01-map-options">Playing with the map's options</a></li>
                        <li><a href="/ch01/ch01-map-layers">Managing the map's stack layers</a></li>
                        <li><a href="/ch01/ch01-map-controls">Managing the map's controls</a></li>
                        <li><a href="/ch01/ch01-moving-around">Moving around map view</a></li>
                        <li><a href="/ch01/ch01-map-extent">Restricting the map's extent</a></li>
                    </ol>
                </li>
            </ul>
        </div>

        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 2</h2>

                    <ol>
                        <li><a href="/ch02/ch02-bing-maps">Using Bing imagery</a></li>
                        <li><a href="/ch02/ch02-openstreetmap">Using OpenStreetMap imagery</a></li>
                        <li><a href="/ch02/ch02-wms-layers">Adding WMS layers</a></li>
                        <li><a href="/ch02/ch02-zoom-effect">Changing the zoom effect</a></li>
                        <li><a href="/ch02/ch02-layer-opacity">Changing layer opacity</a></li>
                        <li><a href="/ch02/ch02-layer-preloading">Buffering the layer data to improve map navigation</a></li>
                        <li><a href="/ch02/ch02-image-layer">Creating an image layer</a></li>
                        <li><a href="/ch02/ch02-tile-size">Setting the tile size in WMS layers</a></li>
                    </ol>
                </li>
            </ul>
        </div>
    </div>

    <hr>

    <div class="row">
        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 3</h2>

                    <ol>
                        <li><a href="/ch03/ch03-gml-layer">Adding a GML layer</a></li>
                        <li><a href="/ch03/ch03-kml-layer">Adding a KML layer</a></li>
                        <li><a href="/ch03/ch03-creating-features">Creating features programmatically</a></li>
                        <li><a href="/ch03/ch03-export-geojson">Exporting features as GeoJSON</a></li>
                        <li><a href="/ch03/ch03-wkt-format">Reading and creating features from a WKT</a></li>
                        <li><a href="/ch03/ch03-markers">Using point features as markers</a></li>
                        <li><a href="/ch03/ch03-removing-cloning-feature-overlay">Removing or cloning features using overlays</a></li>
                        <li><a href="/ch03/ch03-zoom-to-extent">Zooming to the extent of a layer</a></li>
                        <li><a href="/ch03/ch03-geometry-labels">Adding text labels to geometry points</a></li>
                        <li><a href="/ch03/ch03-wfs-layer">Adding features from a WFS server</a></li>
                        <li><a href="/ch03/ch03-clustering">Using the cluster strategy</a></li>
                        <li><a href="/ch03/ch03-reading-features-from-ajax">Reading features directly using AJAX</a></li>
                        <li><a href="/ch03/ch03-heat-map">Creating a heat map</a></li>
                    </ol>
                </li>
            </ul>
        </div>

        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 4</h2>

                    <ol>
                        <li><a href="/ch04/ch04-map-comparator">Creating a side-by-side map comparator</a></li>
                        <li><a href="/ch04/ch04-map-loading-progress">Implementing a work-in-progress indicator for map layers</a></li>
                        <li><a href="/ch04/ch04-vector-feature-events">Listening for the vector layer features' events</a></li>
                        <li><a href="/ch04/ch04-mouse-touch-events">Listening for mouse or touch events</a></li>
                        <li><a href="/ch04/ch04-keyboard-pan-zoom">Using the keyboard to pan or zoom</a></li>
                    </ol>
                </li>
            </ul>
        </div>
    </div>

    <hr>

    <div class="row">
        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 5</h2>

                    <ol>
                        <li><a href="/ch05/ch05-adding-removing-controls">Adding and removing controls</a></li>
                        <li><a href="/ch05/ch05-geolocation">Working with geolocation</a></li>
                        <li><a href="/ch05/ch05-controls-outside-map">Placing controls outside the map</a></li>
                        <li><a href="/ch05/ch05-drawing-features">Drawing features across multiple vector layers</a></li>
                        <li><a href="/ch05/ch05-modifying-features">Modifying features</a></li>
                        <li><a href="/ch05/ch05-measuring">Measuring distances and areas</a></li>
                        <li><a href="/ch05/ch05-feature-info-from-source">Getting feature information from a data source</a></li>
                        <li><a href="/ch05/ch05-wms-feature-info">Getting information from a WMS server</a></li>
                    </ol>
                </li>
            </ul>
        </div>

        <div class="col-sm-6">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 6</h2>

                    <ol>
                        <li><a href="/ch06/ch06-styling-layers">Styling layers</a></li>
                        <li><a href="/ch06/ch06-styling-features-by-geometry-type">Styling features based on geometry type</a></li>
                        <li><a href="/ch06/ch06-styling-features-by-attribute">Styling based on feature attributes</a></li>
                        <li><a href="/ch06/ch06-styling-interaction-render-intents">Styling interaction render intents</a></li>
                        <li><a href="/ch06/ch06-styling-clustered-features">Styling clustered features</a></li>
                    </ol>
                </li>
            </ul>
        </div>
    </div>

    <hr>

    <div class="row">
        <div class="col-sm-12">
            <ul class="list-unstyled">
                <li>
                    <h2 class="h3">Chapter 7</h2>

                    <ol>
                        <li><a href="/ch07/ch07-projections">Working with projections</a></li>
                        <li><a href="/ch07/ch07-custom-control">Creating a custom control</a></li>
                        <li><a href="/ch07/ch07-dragbox-selection">Selecting features by dragging out a selection area</a></li>
                        <li><a href="/ch07/ch07-weather-forecast-imagery">Transitioning between weather forecast imagery</a></li>
                        <li><a href="/ch07/ch07-custom-openlayers-build">Using the custom OpenLayers library build</a></li>
                        <li><a href="/ch07/ch07-freehand-drawing">Drawing in freehand mode</a></li>
                        <li><a href="/ch07/ch07-modifying-layer-appearance">Modifying layer appearance</a></li>
                        <li><a href="/ch07/ch07-drag-and-drop-import">Adding features to the vector layer by dragging and dropping them</a></li>
                        <li><a href="/ch07/ch07-map-permalinks">Making use of map permalinks</a></li>
                    </ol>
                </li>
            </ul>
        </div>
    </div>

    <hr>

    <footer>
        <p><strong>Peter J Langley</strong></p>

        <ul class="list-inline">
            <li><a href="http://pjlangley.com">pjlangley.com</a></li>
            <li><a href="http://www.codechewing.com">codechewing.com</a></li>
            <li><a href="https://twitter.com/codechewing">@codechewing</a></li>
            <li><a href="https://www.linkedin.com/in/peter-j-langley-17b83a3b">LinkedIn</a></li>
        </ul>
    </footer>
</div>

</body>
</html>